<template>
  <div>
    <!--新增交易-->
    <Dialog :visible="tradeVisible" :title="$t('新增交易')"
            :append-body="true"
            @confirm="visibleTradeConfirm" @cancel="visibleTradeClear" @close="visibleTradeClear">

      <el-form label-width="100px" :model="tradeForm" ref="tradeForm" :rules="tradeRulesForm">
        <el-form-item :label="$t('渠道名称')" prop="channelName">
          <span>{{ $t(tradeForm.channelName) }}</span>
        </el-form-item>
        <el-form-item :label="$t('单价')" prop="univalent">
          <el-input maxlength="20" oninput="value = value.replace(/[^\d.]/g, '')" v-model="tradeForm.univalent"/>
        </el-form-item>
        <el-form-item :label="$t('交易日期')" prop="recentTime">
          <el-date-picker
              v-model="tradeForm.recentTime"
              type="datetime"
              value-format="yyyy-MM-dd HH:mm:ss"
              :picker-options="{
                disabledDate(time) {
                  return time.getTime() > Date.now();
               },
              }"
              :default-time="['00:00:00', '23:59:59']"
              :placeholder="$t('选择交易时间')"
          />
        </el-form-item>
      </el-form>
    </Dialog>
  </div>
</template>

<script>
import {getNowTime} from "@/utils/tools";
import eventBus from "@/utils/eventBus";
import {addRecent} from '@/api/channel'
export default {
  props: {
    //新增交易
    tradeVisible: {
      type: Boolean,
      default: false,
    },
    tradeData: {}
  },
  data() {
    return {
      tradeForm: {
        adminUserId: 0,
        channelName: '',
        number: 0,
        univalent: 0,
        recentTime: ''
      },
      tradeRulesForm: {
        univalent: [
          {
            required: true, validator: (rules, value, callback) => {
              const {univalent} = this.tradeForm
              if (univalent === undefined || univalent === '') {
                return callback(new Error(this.$t('单价不能为空')))
              }
              // else if (univalent <=0) {
              //   return callback(new Error(this.$t('单价不能小于0')))
              // }
              return callback()
            }
          },
          // {required: true, message: this.$t('单价不能为空')},
        ],
        recentTime: [
          {required: true, message: this.$t('交易日期不能为空')},
        ]
      },
      mIsAddRecent: false
    }
  },
  watch: {
    tradeVisible(val) {
      if (val) {
        this.addTrade(this.tradeData)
      }
    }
  },
  methods: {
    //新增交易
    addTrade(data) {
      this.tradeForm = {
        adminUserId: data.adminUserId,
        channelName: data.channelName,
        number: data.number,
        univalent: data.univalent ? parseFloat(data.univalent) : '',
        recentTime: getNowTime(new Date())
      }
    },
    visibleTradeClear() {
      this.tradeForm = {
        recentTime: '',
        univalent: ''
      }
      this.$refs.tradeForm.resetFields()
      this.$emit('update:tradeVisible', false)
    },
    visibleTradeConfirm() {
      this.$refs.tradeForm.validate(async v => {
        if (v) {
          let message = this.$t('新增成功')
          const res = await addRecent({...this.tradeForm, univalent: parseFloat(this.tradeForm.univalent)})
          if (res.code === 1) {
            this.$message.success(message)
            this.addTradeSuccess(this.tradeForm.univalent);
            this.visibleTradeClear()
          }
        }
      })
    },
    addTradeSuccess(univalent) {
      // this.$emit("addTradeSuccess", true)
      eventBus.$emit('addTradeSuccessEvent', univalent)
    },
  }
}
</script>

<style scoped>

</style>
